<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			input{
				width: 150px;
				height: 30px;
				margin-bottom: 5px;
				border-radius: 3px;
				outline: none;
				border: 1px solid #DDDDDD;
			}
			::-webkit-input-placeholder {
			    color: salmon;
				font-size: 15px;
			    font-weight: 400;
				/* text-align: center; */
				text-indent: 30px;
			}
		</style>
	</head>
	<body>
		<pre>
			<!-- 首先IE9及以下不支持placeholder。IE10需要用:-ms-input-placeholder,并且属性需要加上!important提高优先级。
			
			<style>
			    input:-ms-input-placeholder {
			        color: green !important;
			    }
			</style>
			<input type="text" placeholder="hello world" style="color: red;">
			
			//其他版本浏览器
			/* - Chrome ≤56,
			   - Safari 5-10.0
			   - iOS Safari 4.2-10.2
			   - Opera 15-43
			   - Opera Mobile >12
			   - Android Browser 2.1-4.4.4
			   - Samsung Internet
			   - UC Browser for Android
			   - QQ Browser */
			::-webkit-input-placeholder {
			    color: #ccc;
			    font-weight: 400;
			}
			
			/* Firefox 4-18 */
			:-moz-placeholder {
			    color: #ccc;
			    font-weight: 400;
			}
			
			/* Firefox 19-50 */
			::-moz-placeholder {
			    color: #ccc;
			    font-weight: 400;
			}
			
			/* - Internet Explorer 10–11
			   - Internet Explorer Mobile 10-11 */
			:-ms-input-placeholder {
			    color: #ccc !important;
			    font-weight: 400 !important;
			}
			
			/* Edge (also supports ::-webkit-input-placeholder) */
			::-ms-input-placeholder {
			    color: #ccc;
			    font-weight: 400;
			}
			
			/* CSS Working Draft */
			::placeholder {
			    color: #ccc;
			    font-weight: 400;
			} -->
			
			
		</pre>
		昵称：<input type="text" name="" id="" value="" placeholder="请输入昵称" />
		<br />
		密码：<input type="password" name="" placeholder="请输入密码" />
	</body>
</html>
